<template>
  <div class="aboutme_control">
    <div class="row">
      <div class="col-md-7">
        <div class="row">
          <div class="col-md-6">
            <div class="es-card" style="margin-top: 0.625rem">
              <div class="es-card-body">
                <h5>Would you need a Custom License ?</h5>
                <p>
                  Get a free quote for a custom license that allows using Keen
                  in your project with an unlimited number of distributions.
                </p>
                <button
                  class="es-button es-round es-blue"
                  style="margin-top: 0.625rem"
                  @click="
                    buttonHandle({
                      path: item.path,
                      params: { ...item.params },
                    })
                  "
                >
                  Card Link
                </button>
              </div>
            </div>
          </div>
          <div class="col-md-6">
            <div class="es-card" style="margin-top: 0.625rem">
              <div class="es-card-body">
                <h5>Would you need a Custom License ?</h5>
                <p>
                  Get a free quote for a custom license that allows using Keen
                  in your project with an unlimited number of distributions.
                </p>
                <button
                  class="es-button es-round es-green"
                  style="margin-top: 0.625rem"
                  @click="
                    buttonHandle({
                      path: item.path,
                      params: { ...item.params },
                    })
                  "
                >
                  Card Link
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-5">
        <div class="row">
          <div class="col-md-6">
            <h3 class="">More for Me</h3>
            <div class="aboutme_list">
              <a href="https://devs.keenthemes.com" target="_blank">
                Support
              </a>
              <a
                href="https://preview.keenthemes.com/html/keen/docs"
                target="_blank"
              >
                Docs
              </a>
              <a href="/keen/changelog">Changelog</a>
              <a
                href="https://keenthemes.com/tutorials/categories/keen-admin"
                target="_blank"
              >
                Tutorials
              </a>
              <a
                href="https://themes.getbootstrap.com/product/keen-the-ultimate-bootstrap-admin-theme/#reviews-tab"
                target="_blank"
              >
                Reviews
              </a>
            </div>
          </div>
          <div class="col-md-6">
            <h3 class="">Stay Connected</h3>
            <div class="aboutme_list">
              <a
                href="https://www.youtube.com/c/KeenThemesTuts/videos"
                target="_blank"
              >
                Youtube
              </a>
              <a href="https://github.com/KeenthemesHub" target="_blank">
                Github
              </a>
              <a href="https://twitter.com/keenthemes" target="_blank">
                Twitter
              </a>
              <a href="https://www.instagram.com/keenthemes" target="_blank">
                Instagram
              </a>
              <a
                href="https://www.linkedin.com/company/keenthemes"
                target="_blank"
              >
                Linkedin
              </a>
              <a href="https://dribbble.com/keenthemes" target="_blank">
                Dribbble
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "AboutMeControl",
};
</script>

<style lang="scss">
.aboutme_control {
  clear: both;
  margin: 1.25rem 0 0;
  h3 {
    font-size: 1.5rem;
    margin: 0.625rem 0 0;
  }
  .aboutme_list {
    a {
      display: block;
      padding: 0.75rem 0;
    }
  }
}
</style>
